<html lang="en" xml:lang="en"><head>
<META http-equiv="Content-Type" content="text/html">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><META name="description" content="Apps can be modified directly with  URL parameters."><meta name="content-language" content="en"><link href="rsrc/htmlhelp.css" rel="stylesheet" type="text/css"><title>Web AppBuilder for ArcGIS | Help - 
Use URL parameters
</title>
                <script type="text/javascript" language="JavaScript">
                    var pathL  = self.location.pathname.split ("/");
                    var fname = pathL[pathL.length-1];
                    var i = fname.lastIndexOf (".htm");
                    if (i>=0) {
                    fname = fname.substring (0, i)
                    } else {
                    //??
                    }
                    if (self.location.hash) {
				    		      fname = fname + self.location.hash;
						        }
                    self.location.replace ("../index.html#//" + fname);
                </script>
                </head><!--Publication GUID: [GUID-E7D1C130-8F87-4109-8D61-E73A46083F52]--><!--Topic GUID: [GUID-826C68AF-678F-4A13-B9C2-5D07847B0739]--><body><div id="content"><div class="header"><h1>
Use URL parameters
</h1><div id="breadcrumb"></div></div>

<p id="GUID-69EBDFCC-B403-4D51-9804-58A8FF9C8CA4">Apps created with  Web AppBuilder can be modified directly with  URL parameters. The URL always begins with <span class="usertext">&lt;your app&gt;/?</span>  and includes one or more of the parameters listed below. Your app could be deployed in your web server or  launched inside the Builder. To include more than one parameter, use an ampersand (&amp;) to separate the parameters. For example:</p>
<p id="GUID-0719B8A4-53A8-44F5-86F0-71CC8F2A4922">Deployed app</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your hosted app&gt;/?find=380 new york street, redlands, ca&amp;locale=fr
</code></pre></div>
</div><p id="GUID-6C8E222B-193C-405F-B75E-9C11BE524B81">App launched  in the Builder</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your machine name&gt;:3344/webappbuilder/apps/4/?find=380 new york street, redlands, ca&amp;locale=fr
</code></pre></div>
</div><div class="notes" id="GUID-A4DE81AF-A266-4A3A-8744-A0D0CA44FF48"><div class="tip"><img class="note_img" src="rsrc/tip.png" alt="Tip" title="Tip"><span>Tip:</span></div><div class="tipbody"><p id="GUID-E582A095-1873-44F5-AE9C-D9BCD516F3DF">Now there is an easier way to construct URL parameters. Add the Share widget in the app and click <span class="uicontrol">Link Options</span>. <span class="uicontrol">Link preview</span> displays the parameters you selected and a short cut link including the url parameters is automatically generated for you.</p></div></div><div class="notes" id="GUID-55B8AE24-C76C-4956-A002-F06F59D4F4AF"><div class="caution"><img class="note_img" src="rsrc/caution.png" alt="Caution" title="Caution"><span>Caution:</span></div><div class="tipbody"><p id="GUID-01BF6EAB-B0D0-4656-83C2-85C1EFDC5714">Currently  3D apps do not support URL parameters.</p></div></div><div class="section1" id="ESRI_SECTION1_3C7631A2FC7141BDAC731FAADCB9849E" purpose="section1"><h2>Encode the query parameters</h2><p id="GUID-22686474-A991-4851-A24A-89FD3DC0308A"> All query parameters must be encoded. Encoding
replaces invalid characters with % followed by their hex
equivalent.</p><p id="GUID-339F078F-F697-4780-A7F2-3AB56A355269"> For example, here is an unencoded URL parameter:<div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?find=380 new york street, redlands, ca
</code></pre></div>
</div></p><p id="GUID-6F8541B1-32DB-4CA4-8284-CA5DB9FA1C79"> Here is the same parameter encoded:<div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?find=380%20new%20york%20street,%20redlands,%20ca
</code></pre></div>
</div></p><p id="GUID-7180524C-8607-4BE7-A121-7E49F741728F"> The web has many free sites and tools for
generating encoded URLs. For example, Albion Research Ltd. has a <a target="_blank" class="xref" rel="http://www.albionresearch.com/misc/urlencode.php" href="http://www.albionresearch.com/misc/urlencode.php">URLEncode and URLDecode Page</a>. 
For readability, the rest of the examples in this topic are not
encoded.</p></div>
<div class="section1" id="ESRI_SECTION1_DFA518B2DF5945EFB77D1C925DA2CF76" purpose="section1"><h2>Center map</h2><p id="GUID-BDA3F704-735D-4FAD-A83E-638E2C135C2B"> To center the map at a particular location,
set <span class="usertext">center=</span> using geographic coordinates (x,y) or projected
coordinates (x,y,WKID). </p><div class="notes" id="GUID-38BB5F6D-49A3-4A95-A34E-7D44C7ADF0F2"><div class="caution"><img class="note_img" src="rsrc/caution.png" alt="Caution" title="Caution"><span>Caution:</span></div><div class="tipbody"><p id="GUID-0C8D393C-F2C9-4048-88D7-86C49EB00FF7">You can use commas or semicolons as
separators. Use semicolons if your numbers use colons as their
decimals</p></div></div><p id="GUID-0FEF6967-99C3-4209-AA93-754C3EB99A46"> Geographic coordinates example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?center=34,-50
</code></pre></div>
</div><p id="GUID-4A3FC794-8F03-4DD2-8AC6-9BFBDC26199F"></p><p id="GUID-4430E7EF-9A81-46C0-A317-817D9D6E1166"> Projected coordinates example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?center=500000,5500000,102100
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_406F3A2E62CF4737ACD37B0ABD562E91" purpose="section1"><h2>Define scale level</h2><p id="GUID-6FA70EE6-1EF0-4676-AB00-B0A266EF5824">To define the scale level of the map, use the <span class="usertext">center=</span> and <span class="usertext">level=</span> parameters. The level parameter accepts the level ID of the cache scale as listed in  the map service's REST endpoint.  For example:</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/??center=20,45&amp;level=4
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_D62E5FCABC6E471DB3B0CD44E88FFFF2" purpose="section1"><h2>Define scale</h2><p id="GUID-802DAAFD-FC4F-40E7-AD5F-ED9158E850BC">To define the scale  of the map, use the <span class="usertext">center=</span> and <span class="usertext">scale=</span> parameters. The scale parameter   accepts the cache scale  as listed in  the map service's  REST endpoint. For example:</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?center=20,45&amp;scale=4622324
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_7D207DF919C049D68B7F9E1423962B4E" purpose="section1"><h2>Define extent</h2><p id="GUID-E94AF6E8-6BA2-49C1-804A-EBBDDF152042">To define the extent of the map, use <span class="usertext">extent=</span> to define the extent of the map. The extent parameter accepts geographic coordinates (GCS) as MinX,MinY,MaxX,MaxY or projected coordinates (PCS) as MinX,MinY,MaxX,MaxY,WKID. You can use commas or semicolons as separators. Use semicolons if your numbers use colons as their decimals.</p><p id="GUID-47CF7105-9643-4BF7-ABDC-4A83804080B8"> Geographic coordinates example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?extent=-117.20,34.055,-117.19,34.06
</code></pre></div>
</div><p id="GUID-2590ADD2-DE18-47DB-AADA-73AA217EA94A"></p><p id="GUID-CDD92F8A-C0D3-4ED7-A1E2-16969B5282DD"> Projected coordinates example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?extent=-13079253.954115,3959110.38566837,-12918205.318785,4086639.70193162,102113
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_3F3ECFBE570E406E9020F257A0D25064" purpose="section1"><h2>Find location of feature to open map</h2><p id="GUID-2FAA9643-8CD1-4EE6-A7E3-FD45EA0B0C9E">To find a location or feature that is used to open the map, use <span class="usertext">find=</span>. The map is automatically zoomed to the closest match and a callout marker is added to the map. The find parameter accepts single-line addresses, partial addresses (such as city only or country only), place-names, longitude-latitude coordinates, and features in searchable layers (such as 1916352001 for a Parcel Identification Number (PIN)). For example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?find=380 new york street, redlands, ca
</code></pre></div>
</div><div class="notes" id="GUID-6E579D0A-0BC6-422A-A22F-FF66819380D0"><div class="caution"><img class="note_img" src="rsrc/caution.png" alt="Caution" title="Caution"><span>Caution:</span></div><div class="tipbody"><p id="GUID-06044E0E-1A51-43C9-B1AA-02DE83DC8DBD"> All query parameters must be encoded. </p></div></div></div><div class="section1" id="ESRI_SECTION1_84F07DECDAEF450988B236D57C635A94" purpose="section1"><h2>Add point</h2><p id="GUID-ADC1542A-9EF3-4E74-A67A-269022966AC2">To add a point to the map, use <span class="usertext">marker=&lt;x&gt;,&lt;y&gt;</span>. The point is added to the map at the specified x and y location. You can also include the following optional properties:</p><ul purpose="ul" id="UL_C3B28BCB026E4906999AACFE991605B0"><li purpose="li" id="LI_DAACC1CC56644BD2BBA2C21394323F3B">&lt;wkid&gt;—Spatial reference of the x,y coordinates added to the map. If you do not include a WKID, GCS coordinates are used.</li><li purpose="li" id="LI_659DE2A1DBCF404EB589BF7F015A8600">&lt;encoded title&gt;—Title of the point pop-up. If you do not include a title, the pop-up will be empty.</li><li purpose="li" id="LI_C9E7FACC2F8F4DD29502D1CB1B67AB1A">&lt;encoded icon URL&gt;—Symbol for the point. If you do not include a symbol, a blue marker symbol is used.</li><li purpose="li" id="LI_82C268AEE20B42478C5432E70C40C04D">&lt;encoded label&gt;—Label next to the point symbol.</li></ul><p id="GUID-FB0BEC99-EA0B-44CB-A0FF-86A7B075AA11">Considerations</p><ul purpose="ul" id="UL_A1A755F12EF44B1292454B44E582B08B"><li purpose="li" id="LI_4F6B79CF132E4E438A37EFC3E963B4C9">&lt;x&gt;,&lt;y&gt; are required.</li><li purpose="li" id="LI_F6FD6499D70E449ABAABA8DB9DF2D082">Be sure to encode the title, icon, and label parameters.</li><li purpose="li" id="LI_64D4E62F9C7C41A19FB7735BB0470BE9">You must add properties in this order: marker=&lt;x&gt;,&lt;y&gt;,&lt;wkid&gt;,&lt;encoded title&gt;,&lt;encoded icon URL&gt;,&lt;encoded label&gt;.</li><li purpose="li" id="LI_F00539B88E024B66A25D33FB6D0A6EDE">You can use commas or semicolons as separators. Use semicolons if your numbers use colons as their decimals.</li><li purpose="li" id="LI_CAB2EFE19A534F07B12EA523324884A0">Use empty values. Do not use spaces. For example, if you want to specify a label and none of the other optional properties, add the label as the sixth parameter with empty values for the others (x;y;;;;label).</li><li purpose="li" id="LI_82786E0B14B14194A8DB6E87671FB946">If you want the map to zoom in (in addition to centering on the point), include the level= parameter.</li></ul><p id="GUID-B1B49353-68D0-4C0B-9CC8-355458D69C38">Example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?marker=-79.234826;38.147884;;Race start and finish;;Grindstone 100 Ultra Marathon&amp;level=7
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_ED1AF7A40ABD4F0F8F6456F51850A1E7" purpose="section1"><h2>Query feature </h2><p id="GUID-A59BE09E-3956-44D7-A246-5D98E330F4FD">To query a feature and zoom to it, you can use one fo the following   options:<ul purpose="ul" id="UL_7806B256F5E045E6888B4AA2AA3D17E3"><li purpose="li" id="LI_05507E30551141D99A58E4F11E5CB298"><span class="usertext"> query=&lt;layer name&gt;,&lt;field name&gt;,&lt;field value&gt;</span></li><li purpose="li" id="LI_654D808798694603AF1933DE0CF4579D"><span class="usertext">query=&lt;layer name&gt;, &lt;where clause&gt;</span></li><li purpose="li" id="LI_2CAED107F90F436B8650C116DDCF4C68"><span class="usertext"> query=&lt;layer id&gt;,&lt;field name&gt;,&lt;field value&gt;</span></li><li purpose="li" id="LI_7B99C7C74C5D463BA738AF80585A4374"><span class="usertext">query=&lt;layer id&gt;, &lt;where clause&gt;</span></li></ul> <div class="notes" id="GUID-34A32C4C-8991-4627-ACC2-1966DD659C94"><div class="caution"><img class="note_img" src="rsrc/caution.png" alt="Caution" title="Caution"><span>Caution:</span></div><div class="tipbody"><p id="GUID-2E97D1F2-B210-4953-8634-3B29814B018C">All of the query parameters are case sensitive and must be encoded.</p></div></div></p><p id="GUID-841FF4F9-7577-4599-945C-C00CDD3BDA12"> Since the layer name can be changed, it is strongly recommended using the layer id in the query. You can retrieve the layer id from web map id  as shown below.<span class="usertext">http://&lt;your portal url&gt;/sharing/rest/content/items/32a83775654249dcae6b8f2eff5d4072/data/?f=pjson</span>.   </p><div class="notes" id="GUID-6D2E4C33-5877-41D6-B10E-8A6F6AE486D2"><div class="caution"><img class="note_img" src="rsrc/caution.png" alt="Caution" title="Caution"><span>Caution:</span></div><div class="tipbody"><p id="GUID-54ABA104-A1BD-403E-8B60-140038252390">Make sure the web map is shared publicly when you retrieve the layer id.</p></div></div><p id="GUID-CDF752C4-7175-4016-9B30-5413BD68484F">For example, a layer is added in the map individually as shown below in the  json format. It     has layer  id as Census_8491, field name as POP2000, and field value as 1211537. You can perform the following queries: <div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code><span class="err">id:</span> <span class="s2">&quot;Census_8491&quot;</span><span class="err">,</span>
<span class="err">layerType:</span> <span class="s2">&quot;ArcGISFeatureLayer&quot;</span><span class="err">,</span>
<span class="err">url:</span> <span class="s2">&quot;http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3&quot;</span><span class="err">,</span>
<span class="err">visibility:</span> <span class="kc">true</span><span class="err">,</span>
<span class="err">opacity:</span> <span class="mi">1</span><span class="err">,</span>
<span class="err">mode:</span> <span class="mi">1</span><span class="err">,</span>
<span class="err">title:</span> <span class="s2">&quot;Census - states&quot;</span><span class="err">,</span>
</code></pre></div>
</div></p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_8491,POP2000,1211537
</code></pre></div>
</div><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_8491,POP2000=1211537
</code></pre></div>
</div><p id="GUID-F0999E6E-ED20-4D6C-AEC5-D925856AA74E">You can also do queries against the string or OBJECTID.</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_8491,STATE_NAME,California
</code></pre></div>
</div><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_8491,STATE_NAME=&#39;California&#39;
</code></pre></div>
</div><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_8491,OBJECTID,1
</code></pre></div>
</div><p id="GUID-68148617-26B3-4CE4-83B0-793863A30788">Often a layer is added as a group of map service. To query a sublayer  in a group, use <span class="usertext">&lt;layer id_sublayer id&gt;</span>  as the layer id instead. Taking the following layer as an example, it has layer id as Census_3217 and sublayer id as index of 3. The layer id for the sublayer  should be Census_3217_3. You can perform the following queries:</p><p id="GUID-D71E6BA9-4FC7-4690-BE55-C63C35BB9F86"><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code><span class="err">id:</span> <span class="s2">&quot;Census_3217&quot;</span><span class="err">,</span>
<span class="err">layerType:</span> <span class="s2">&quot;ArcGISMapServiceLayer&quot;</span><span class="err">,</span>
<span class="err">url:</span> <span class="s2">&quot;http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer&quot;</span><span class="err">,</span>
<span class="err">visibility:</span> <span class="kc">true</span><span class="err">,</span>
<span class="err">opacity:</span> <span class="mi">1</span><span class="err">,</span>
<span class="err">title:</span> <span class="s2">&quot;Census&quot;</span>
</code></pre></div>
</div></p><p id="GUID-AE7C4703-3569-4D3A-8AD4-165F9FC44E3F"><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_3217_3,POP2000,1211537
</code></pre></div>
</div><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?query=Census_3217_3,POP2000=1211537
</code></pre></div>
</div></p></div><div class="section1" id="ESRI_SECTION1_4C835BF50CDA43BFB576627CBAF18853" purpose="section1"><h2>Switch locale</h2><p id="GUID-FB50D5F3-06EF-490A-B1B6-B759C1F4B4E7">To switch app language, use <span class="usertext">locale=&lt;language code&gt;</span>. These language codes are supported: ar,cs,da,de,en,el,es,et,fi,fr,he,it,ja,ko,lt,lv,nb,nl,pl,pt-br,pt-pt,ro,ru,sv,th,tr,zh-cn,vi,zh-hk,zh-tw.</p><p id="GUID-32F8D99C-43E3-4632-81BF-BA52AD087776"> For example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?locale=fr
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_DB35616D8A7C4C6FBA6DE785666F08D7" purpose="section1"><h2>Authenticate user</h2><p id="GUID-25E946CB-2651-4D62-8C3B-F1E78F318FA5">To automatically authenticate a user in non-public app, use <span class="usertext">token=&lt;token&gt;</span>. In this way users do not need to enter their user name and password. For example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?token=utmVcabc_LNyEQ7OuuHD73em0MErLR_cudJTeSIdMFTnL0poF3shVBeng5ieWHyZn0kAA8nhUg7jseQxz3bi5crnFMMpldDiJLrtzmO3jEM-ZNVIUEh5_qMms-YgXUwGgFbeQlM9WaI3jwraUqwah0yCceBAxEkEIAEWvlBEDfVsYs3LZydORRcs2QIcdLas
</code></pre></div>
</div></div>
<div class="section1" id="ESRI_SECTION1_01F86DEC2181416888D44A32D3096887" purpose="section1"><h2>Control when to turn on mobile layout</h2><p id="GUID-D798EA5C-A0CD-4A08-8501-681C3DE10FBB"> The app supports two styles of layout based on the screen size.  One is for desktop and one  is for mobile devices. When either the height or width of a screen display is less than 600 pixels, the mobile layout applies automatically. However this may result in unexpected behavior when the  app is embedded in a website. For example, the pop up in the website becomes mobile layout style. To control the layout style, use <span class="usertext">mobileBreakPoint=&lt;pixel number&gt;</span>. For example, you can remain in desktop style until the screen size is less than 300 pixels:</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://&lt;your app&gt;/?mobileBreakPoint=300
</code></pre></div>
</div></div><div class="section1" id="ESRI_SECTION1_F7144D3986F34DB9BC88D626768A4750" purpose="section1"><h2>Run apps in different config file</h2><p id="GUID-D499CEE1-7972-4652-9F1E-BADC1625DC89">By default, the app runs upon the config.json file in the stemapp or stemapp3d folder. If you want to  apply different config file to the app, such as myConfig.json in the <span class="usertext">stemapp\sample-configs</span> folder, use <span class="usertext">config=&lt;file name&gt;</span>.</p><p id="GUID-C7DC9656-09DF-4CB8-9E49-7CFCBCDED789">For example</p><div class="codeblock" purpose="codeblock"><div class="highlight"><pre><code>http://[your app]/?config=sample-configs/myConfig.json
</code></pre></div>
</div></div><div class="footer"> Copyright © 1995-2016 Esri. All rights reserved. </div></div></body></html>